<!--
 * @Author: CJF
 * @Email: 1757818940@qq.com
 * @Date: 2022-02-25 16:03:59
 * @LastEditTime: 2022-02-28 11:47:00
 * @Description: 登录广告
-->
<template>
  <div class="advbaox">
    <van-circle
     class="timeout"
      v-model="currentRate"
      :rate="currentRate"
      size='40px'
      :clockwise="false"
      color='#ed3d30'
      layer-color="#dddddd"
      :text='timeout+"s"'
    />
    <span class="jump" @click="jump()">跳过</span>
    <div class="logo"></div>
    <p>快乐购&nbsp;购宜购</p>
  </div>
</template>
<script>
export default {
    data() {
        return {
            timeout:5,
            currentRate:100,
            timer:null,
            auto:''
        }
    },
    created() {
        this.timer=setInterval(() => {
            this.currentRate-= 1
            if( this.currentRate>=0){
                this.timeout = Math.ceil(this.currentRate/20)
            }else{
                clearInterval(this.timer)
                if(this.auto === 'ok'){
                    this.$router.push('/home')
                      
                }else{
                    this.$emit('change',false)
                }
            }

        }, 50);
        let isauto =localStorage.getItem('isauto')
      
        let token = localStorage.getItem('token')
        
        
         if(isauto){
             let userinfo = localStorage.getItem('user')
             this.$store.commit('welfareah/setToken',token)
             sessionStorage.setItem('token',token)
             let user = JSON.parse(userinfo)
             this.$store.commit('welfareah/setUserinfo',user)
             this.auto ='ok'
         }else{
             this.auto = 'error'
         }
       

    },
    methods: {
        jump(){
            if(this.auto === 'ok'){
                clearInterval(this.timer)
                this.$router.push('/home')
                return
            }
            if(this.auto === 'error'){
                 clearInterval(this.timer)
                this.$emit('change',false)
                return
            }
        }
    },
}
</script>
<style lang="less" scoped>
.advbaox {
  display: flex;
  height: 100%;
  width: 100%;
  position: fixed;
  background: #fff;
  padding: 14vh 10px 20px;
  box-sizing: border-box;
  flex-direction: column;
  .logo {
    width: 250px;
    height: 340px;
    margin: 0 auto;
    background: url(../../images/bg.png) center center no-repeat;
    background-size: 100% 100%;
  }
  p {
    margin-top: 80px;
    text-align: center;
    color: #222222;
   
    
  }
  .timeout{
      position: absolute;
    //   left: 0;
      right: 50px;

      top: 20px;
  }
  .jump{
       position: absolute;
       right: 15px;
      font-size: 0.7rem;
      top: 30px;
  }
}
</style>